<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // 先求A  再求B  再求C


        //利用function*  申明一个getData的状态机对象
        function* getData() {

            //用yield关键字定义每次的状态
            console.log("A开始");
            yield setTimeout(() => {
                console.log("A成功");
                //第二次调用next方法需要在第一个yield状态内部调用，如果继续在外部调用则三个一起出来
                result.next()
            }, 1500)    

            console.log("B开始");   
            yield setTimeout(() => {
                console.log("B成功");

                // 第三次须在第二次调用成功后在调用
                result.next()
            }, 1500)

            console.log("C开始");
            yield setTimeout(() => {
                console.log("C成功");
            }, 1500)
        }

        // 调用getData函数，返回一个iterator对象
        const result = getData()
        console.log(result);

        //调用.next方法返回第一个yield状态
        result.next()   
    </script>
</body>

</html>